<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="referrer" content="origin" />
		<meta
			name="viewport"
			content="width=device-width, viewport-fit=cover, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"
		/>
		<meta
			http-equiv="Cache-Control"
			content="no-cache, no-store, must-revalidate"
		/>
		<title>支付完成</title>
		<script
			type="text/javascript"
			charset="UTF-8"
			src="https://wx.gtimg.com/pay_h5/goldplan/js/jgoldplan-1.0.0.js"
		></script>
		<script
			type="text/javascript"
			src="https://bweb.yingfeiwangluo.com/lib/jquery.min.js"
		></script>
		<!-- <script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>
		<script>
			// VConsole 默认会挂载到 `window.VConsole` 上
			var vConsole = new window.VConsole();
		</script> -->
		<style>
			body {
				padding: 0;
				margin: 0;
			}

			.order_box {
				padding-top: 30px;
				display: flex;
				align-items: center;
				flex-direction: column;
			}

			.icon {
				width: 51px;
				height: 51px;
				display: block;
				margin-bottom: 14px;
			}

			.b_name {
				font-weight: bold;
				font-size: 17px;
				color: #0f0f2b;
				line-height: 24px;
				margin-bottom: 48px;
			}

			.btns {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
			}
			.btns > * + * {
				margin-left: 15px;
			}

			.btns .btn {
				width: 108px;
				height: 33px;
				border-radius: 4px;
				border: 1px solid #b5b5b5;
				display: flex;
				align-items: center;
				justify-content: center;
				font-weight: 400;
				font-size: 12px;
				color: #666666;
				line-height: 17px;
			}
			.btns .home {
				width: 108px;
				height: 33px;
				background: #b41733;
				border-radius: 4px;
				border: 1px solid #b41733;
				display: flex;
				align-items: center;
				justify-content: center;
				font-weight: 400;
				font-size: 12px;
				color: #ffffff;
				line-height: 17px;
			}
		</style>
	</head>

	<body>
		<div class="order_box">
			<image class="icon" src="/static/images/success.png" />
			<div class="b_name" id="b_name">支付成功</div>
			<div class="btns">
				<div class="btn" id="toOrder">查看详情</div>
				<div class="home" id="toHome">返回首页</div>
			</div>
		</div>

		<script>
			let mchData = {
				action: "onIframeReady",
				displayStyle: "SHOW_CUSTOM_PAGE",
			}; //显示当前商家结果页
			// let mchData = {
			// 	action: "onIframeReady",
			// 	displayStyle: "SHOW_CUSTOM_PAGE",
			// 	height: 900,
			// }; //显示当前商家结果页 自定义结果页高度
			//let mchData ={action:'onIframeReady',displayStyle:'SHOW_OFFICIAL_PAGE'};//显示微信官方结果页
			let postData = JSON.stringify(mchData);
			parent.postMessage(postData, "https://payapp.weixin.qq.com");
			//初始化console
			// var vConsole = new VConsole();
			//获取返回页面参数
			function getQueryString(name) {
				var query = window.location.search.substring(1);
				var vars = query.split("&");
				for (var i = 0; i < vars.length; i++) {
					var pair = vars[i].split("=");
					if (pair[0] == name) {
						return pair[1];
					}
				}
				return null;
			}
			//获取参数
			var out_trade_no = getQueryString("out_trade_no"); //商户订单号
			// console.log(window.location.search);
			document.getElementById("toOrder").onclick = () => {
				$.ajax({
					type: "GET",
					url: "/app/order/getGoodsOrderDetail",
					data: {
						out_trade_no,
					},
					dataType: "json",
					success: ({ code, data }) => {
						if (code == 1) {
							//注册点击事件(去详情)
							var mchData = {
								action: "jumpOut",
								jumpOutUrl: `/packageOrder/detail/index?id=${data.id}`, //跳转的页面
							};
							// console.log(mchData);
							var postData = JSON.stringify(mchData);
							parent.postMessage(
								postData,
								"https://payapp.weixin.qq.com"
							);
						}
					},
				});
			};
			document.getElementById("toHome").onclick = () => {
				//注册点击事件(去详情)
				var mchData = {
					action: "jumpOut",
					jumpOutUrl: "/pages/index/index", //跳转的页面
				};
				// console.log(mchData);
				var postData = JSON.stringify(mchData);
				parent.postMessage(postData, "https://payapp.weixin.qq.com");
			};
		</script>
	</body>
</html>
